User blog:Zandrae/Of Cascading Stylesheets and Switch Statements
Cascading Style Sheet User:RiaSunhammer pointed out that something exploded on the front page with the CSS tweaks or that the page has had a problem all along with there being a lack of space between the right bar and left bar of the front page. It's hard to edit cascading stylesheets on wikia because they don't actually let you edit the real CSS, you can just insert your own code into an override sheet. I've been making webpages for a long time. I started making webpages in summer of 1993, I learned HTML in a single setting, but I stopped really keeping up with the code side of the web before the implementation of xml, divs, and cascading stylesheets. I can infer what the code is doing by looking at it. Editing other people's code can be somewhat difficult if they haven't commented it. Sometimes you look at things and go What the hell are you doing? Why? Why are you doing that? Then you scream and make like Lor'themar Theron and flip a bench. So I'm viewing this front page, trying to figure out where the no padding on the column is coming from and how I can fix it. I'm inspecting elements in chrome and I manage to find a section that basically shows all the cascading stylesheets. Or most of them at least. It's massive. It's mangled. After running it through the wonderful CSS Beautifier I managed to get it in a readable nicely spaced out state. When spaced out it's 13,049 lines long. Thirteen thousand lines long. I dumped the massive monster on pastebin. Some browser addons that scan page code for things to block, like tumblr music player blocker, might slow down the load time substantially, but I digress. Here is the beast. Now that I've got the code plugged into atom, nicely spaced out, readable, colorized with proper CSS coloring, I can much better search and edit things. I'm not sure the extent of the editing we can do on this site but if I can, I might try to override the top bar colors so that they're not glaring white. I have Irlen Syndrome which makes it difficult for me to read text on a white background. I use adaptive tools which change the background of pages to the color that I read best on. Unfortunately that's like a 50% pastel purple, and the internet, the whole internet, has decided that 50% grey text on white backgrounds, which is extremely low contrast is "aesthetic, clean, and easy to read". Eyestrain is a thing. It's why people use stuff like f.Lux which is basically a blublocker for your computer. Grey text on white kneecaps my accessibility addon's ability to render pages as for some reason the developer didn't put a "force grey text to black" feature in it. Needless to say this experience has made me really aware of the importance of contrast as an accessibility issue on webpages. So my concerns are readability and not burning people's eyes. If I can get the top bar to play along, or perhaps match the lovely golden bottom bar that pops up, it'll be glorious. It may take some image editing. Don't Panic if you see random colors I digress, I'm going to try and tweak parts of the site today at some point, and fix the extra thick outline around some things to make them look a little better. I think some parts of the infoboxes have thick double outlines. Because of this, you might experience parts of the website turning other colors seemingly at random. This is me plugging in CSS with distinct colors in order to identify what line of code controls what. Don't panic! I'll put it back as soon as I figure out what controls what. If you see something turn a funny color and it doesn't go away in a day or so, DO let me know so I can fix it, just in case I miss something somewhere in my testing. Switch Statements I also started digging into code for infoboxes a little. There is something called a "Switch statement. It basically lets me set up conditionals in infoboxes. This theoretically can allow for some neat things like setting up dynamic faction icons in the infobox top bars. So, let's say we have a field FactionIcon. *If user puts "Alliance" in FactionIcon *Then display little Alliance icon *else if user puts "Horde" in FactionIcon *Then display little Horde icon *Else if user puts something else or nothing *Have no icon. I'm going to have to play with it, but will probably do this -after- fixing the front page. Signatures You may have noticed my signature is pink. --Zandrae (Talk) 20:12, November 5, 2016 (UTC) For now, you can do this code to emulate it. YOURUSERNAME (Talk) You can find a lit of wow class colors Here. Technically folks can use whatever color they want but boy would it be slick looking if we stuck to the wow class code colors. I may introduce cascading stylesheet code to allow people to easily put the class colors in places for reasons I don't yet know. Because it's fun. I wonder if it's possible to make links to certain things appear as colored by default, so linking to Zandrae Pyreanor appears Paladin pink. I have a feeling it's probably not possible as I can't say I've seen it. Better Guidelines or Quick Start Guide When patrolling the Wiki, Ria and I have discovered some very strange and funny things. Funny as in I was on discord voice laughing like a hyena as the strangeness continued to accumulate. We had people who made themselves categories and placed larger broad categories into their names. This implies, in a funny way, that they are, say, every Alliance Death Knight. We had people posting profiles on their userpages then putting themselves in categories. We had one lovely fellow with a lovely profile who put every single part of his profile as headlines thus making his entire profile show up in the Table of Contents. This indicates that whatever guidelines or styleguides are there are not helpful, are too hard to understand, or are TL;DR. There are a few solutions. *1) Make an easy to understand plain English quick start guide with boilerplates people can copy directly into their page creation adventures. *2) Find a way to alter the neat popup that lets people choose what kind of page to make and have it autopopulate the creation block with well explained a skeleton layout. That means putting comments in explaining what things do and how to do them into the templates somehow. **Update: ***I've edited the template popup box choice so that the default page is a standard character page. ***I've turned on a feature that gives new page creation options to choose three templates. The templates need some cleanup but it's something. ***Still needed: Try to find a way to edit the popup and verbage. Perhaps create a template or something that mimics the popup code but uses custom text and see if we can get the wikia people to change it for us. *3) Find a way to tweak what shows up in the templates section of the side bar on the editing page. Category:Blog posts